<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: admin
  Date: 2019/4/30
  Time: 10:26
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="../common.jsp"%>
<html>
<head>
    <title>Title</title>
</head>
<body>

<table id="flowGrid" class="easyui-datagrid" title="流程列表" style="width:600px;height:250px" toolbar="#tb">
    <thead>
    <tr>
        <th field="applyId" width="10" hidden="true">applyId</th>
        <th field="applyName" width="100">任务名称</th>
        <th field="applyContent" width="150" align="rigth">任务内容</th>
        <th field="userName" width="100" align="center">申请人</th>
        <th field="status" width="100" align="right">状态</th>
        <th field="createTime" width="100" align="center">申请时间</th>
    </tr>
    </thead>
</table>
<div id="tb">
    <a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="addNewFlow()">新增任务</a>
    <a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="showFlowInfo()">查看流程详情</a>
</div>

<div id="flow_show" class="easyui-dialog" title="新增业务请求" data-options="iconCls:'icon-save'" style="border: 0; width: 500px;">
    <table id="infoGrid" class="easyui-datagrid" title="流程详情" style="width:1000px;height:500px">
        <thead>
        <tr>
            <th field="taskId" width="100">任务编码</th>
            <th field="applyName" width="100">任务名称</th>
            <th field="applyContent" width="150" align="rigth">任务内容</th>
            <th field="handleName" width="100" align="center">审批人</th>
            <th field="opinion" width="100" align="center">审批意见</th>
            <th field="flag" width="100" align="right">审批状态</th>
            <th field="createTime" width="100" align="center">审批时间</th>
        </tr>
        </thead>
    </table>
</div>
<div id="fold_edit" class="easyui-dialog" title="新增业务请求" data-options="iconCls:'icon-save'" style="border: 0; width: 500px;">
    <form id="mainForm" method="post">
        <table cellpadding="5">
            <tr>
                <td>申请业务名称:</td>
                <td><input class="easyui-textbox" type="text" name="applyName" data-options="required:true"></input></td>
            </tr>
            <tr>
                <td>申请业务内容:</td>
                <td><input class="easyui-textbox" type="text" name="applyContent" data-options="required:true"></input></td>
            </tr>

        </table>
    </form>
    <div style="text-align: center; padding: 5px">
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="addFlowSubmit()">立即申请</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="closeForm()">取消</a>
    </div>

</div>
<script type="application/javascript">
    $(function () {
        $("#flow_show").dialog('close');
        $("#flowGrid").datagrid({
            url:ctx+"/flow/getFlowList",
            pagination:true,
            pageSize:20,
            pageList:[20,50,100],
            singleSelect:true,
            rownumbers:true,
            onBeforeLoad : function(param) {
                $.messager.progress({
                    text : '数据加载中....'
                });
            },
            onLoadSuccess : function(data) {
                $.messager.progress('close');
            },
            onLoadError : function() {
                $.messager.progress('close');
            }
        });





    });

    function addFlowSubmit(){
        if ($('#mainForm').form('validate')) {
            var formJson = $('#mainForm').find('input').not('[value=""]').serializeJSON();
            $.ajax({
                url : ctx+"/flow/addFlow",
                dataType : "json",
                data : JSON.stringify(formJson),
                type : "POST",
                contentType : "application/json;charset=utf-8",
                success : function(data) {
                    if (data.status == true) {

                        // 重新加载
                        $('#flowGrid').datagrid('reload');
                        $.messager.alert("操作提示",data.respMsg,"info");
                    } else {
                        $.messager.alert("操作提示", data.respMsg, "error");
                    }
                },
                error : function() {
                    $.messager.alert("操作提示", "操作失败！", "error");
                }
            });
        } else {

        }
    }

    function closeForm(){
        $("#fold_edit").dialog('close');
    }
    function addNewFlow(){
        $("#fold_edit").dialog('open');
        $("#mainForm").form("clear");
    }

    function showFlowInfo(){
        var row = $("#flowGrid").datagrid("getSelected");
        if(row){
            $('#flow_show').dialog('open');
            $("#infoGrid").datagrid({
                url:ctx+"/flow/showFlowProcess?processInstanceId="+row.processInstanceId,
                pagination:true,
                pageSize:20,
                pageList:[20,50,100],
                singleSelect:true,
                rownumbers:true,
                onBeforeLoad : function(param) {
                    $.messager.progress({
                        text : '数据加载中....'
                    });
                },
                onLoadSuccess : function(data) {
                    $.messager.progress('close');
                },
                onLoadError : function() {
                    $.messager.progress('close');
                }
            });
        }
    }
</script>
</body>
</html>
